<template>
  <div>
    <div>
        <el-button type="primary" @click="pwadd(),dialogFormVisible1 = true">新增打卡地址</el-button>
        <el-dialog title="编辑" :visible.sync="dialogFormVisible">
            <el-form :model="ruleForm" status-icon :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
                <el-form-item label="地址名称" >
                <el-input v-model="ruleForm.pwname"></el-input>
                </el-form-item>
                <el-form-item label="具体地址" >
                <el-input v-model="ruleForm.address"></el-input>
                </el-form-item>
                <el-form-item label="范围" >
                <el-input v-model="ruleForm.scope"></el-input>
                </el-form-item>
                <el-form-item >
                <el-button type="primary" @click="submitForm('ruleForm')">提交</el-button>
                </el-form-item>
            </el-form>
        </el-dialog>
        <el-dialog title="新增" :visible.sync="dialogFormVisible1">
            <el-form :model="ruleForm" status-icon :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
                <el-form-item label="地址名称" >
                <el-input v-model="ruleForm.pwname"></el-input>
                </el-form-item>
                <el-form-item label="具体地址" >
                <el-input v-model="ruleForm.address"></el-input>
                </el-form-item>
                <el-form-item label="范围" >
                <el-input v-model="ruleForm.scope"></el-input>
                </el-form-item>
                <el-form-item label="操作员" >
                <el-input v-model="ruleForm.operator"></el-input>
                </el-form-item>
                <el-form-item >
                <el-button type="primary" @click="addForm('ruleForm')">提交</el-button>
                </el-form-item>
            </el-form>
        </el-dialog>
        <el-table
            :data="InfoList"
            stripe
            style="width: 100%">
            <el-table-column
                prop="pwname"
                label="地址名称"
                width="180">
            </el-table-column>
            <el-table-column
                prop="address"
                label="具体地址"
                width="180">
            </el-table-column>
            <el-table-column
                prop="scope"
                label="范围"
                width="180">
            </el-table-column>
            <el-table-column
                prop="pwtime"
                label="最后修改时间"
                width="180">
            </el-table-column>
            <el-table-column
                prop="operator"
                label="操作员"
                width="180">
            </el-table-column>
            <el-table-column
                label="操作">
                <template slot-scope="scope">
                <el-button type="text" size="small" @click="pwupdate(scope.row),dialogFormVisible= true">编辑</el-button>
                <el-button type="text" size="small" @click="pwdelect(scope.row.pwid)">删除</el-button>
                </template>
            </el-table-column>
        </el-table>
    </div>
  </div>
</template>

<script>
export default {
  data() {
        return {
        tableData: [],
        InfoList:{
            pwid:'',
            pwname:'',
            address:'',
            scope:'',
            pwtime:'',
            operator:''
        },
        ruleForm:{
            pwid:'',
            pwname:'',
            address:'',
            scope:'',
            operator:''
        },
        dialogFormVisible: false,
        dialogFormVisible1: false
      }
    },
    methods: {
            findAll(){
                this.$axios.get("http://localhost:9525/performance/punch/pwSelect").then(response=>{
                    this.InfoList=response.data.data.list
                }
                ).catch(e=>{
                })
            },
            pwdelect(pwid){
                this.$confirm('此操作将永久删除用户信息, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
                }).then(() => {
                this.$axios.get("http://localhost:9525/performance/punch/pwdelect",{
                    params: {
                    pwid: pwid
                    }
                }).then(response=>{
                    this.findAll();
                    this.$message({
                    message: '删除成功',
                    type: 'success'
                    })
                }).catch(e=>{  
                })
                }).catch(e=>{   
                })
            },
            pwupdate(data){
                this.ruleForm.pwid=data.pwid
                this.ruleForm.pwname= data.pwname
                this.ruleForm.scope= data.scope
                this.ruleForm.address=data.address
            },
            pwadd(){
                this.ruleForm.pwname= ''
                this.ruleForm.scope= ''
                this.ruleForm.address=''
                this.ruleForm.operator=''
            },
            submitForm(){
                this.$axios.post("http://localhost:9525/performance/punch/pwupdate",{
                pwid: this.ruleForm.pwid,
                pwname: this.ruleForm.pwname,
                address: this.ruleForm.address,
                scope: this.ruleForm.scope
              }).then(response=>{
                  this.findAll();
                  this.dialogFormVisible=false
                  this.$message({
                    message: '修改成功',
                    type: 'success'
                  })
              }).catch(e=>{
                  this.$message.error('修改失败')
              })
            },
            addForm(){
                this.$axios.post("http://localhost:9525/performance/punch/pwadd",{
                pwname: this.ruleForm.pwname,
                address: this.ruleForm.address,
                scope: this.ruleForm.scope,
                operator:this.ruleForm.operator
              }).then(response=>{
                  this.findAll();
                  this.dialogFormVisible1=false
                  this.$message({
                    message: '添加成功',
                    type: 'success'
                  })
              }).catch(e=>{
                  this.$message.error('添加失败')
              })
            }

 
    },
    mounted() {
      this.findAll()
    }
}
</script>

<style>
  
</style>